<template>
	<view class="container">
		<view class="layout">
			<view class="redbox">
				<view class="money">¥{{ state.money }}</view>
				<view class="msg">冻结金额</view>
			</view>
			<view class="list-warp" v-if="state.list.length">
				<view class="list-item" v-for="(item, index) in state.list" :key="index" @click="gotoPage(item.id)">
					<view class="left">
						<view class="headpic">
							<image class="pic" :src="item.avatar_url"></image>
						</view>
						<view class="info">
							<view class="label">
								<text class="h4">{{ item.nickname }}</text>
								<text class="tag">冻结中</text>
							</view>
							<view class="mobile">{{ item.tel }}</view>
						</view>
					</view>
					<view class="right">
						<view class="money">+¥ {{ item.price }}</view>
						<view class="time">{{ item.created_at }}</view>
					</view>
				</view>
			</view>
			<view class="empty" style="height: 70vh" v-else>
				<u-empty text="暂无数据" mode="list"></u-empty>
			</view>
		</view>
	</view>
</template>

<script setup>
import { reactive, ref } from 'vue';
import { onShow, onReachBottom } from '@dcloudio/uni-app';
import { get } from '@/request/index.js';

const state = reactive({
	money: 0,
	list: [],
	page: 1,
	totalPage: 1
});

onShow(() => {
	const str = uni.getStorageSync('userinfo');
	const userInfo = JSON.parse(str);
	state.money = userInfo.money_dong;
	getListData();
});

onReachBottom(() => {
	state.page++;
	if (state.page > state.totalPage) return uni.showToast({ title: '我也是有底线的 ~' });
	getListData();
});

const getListData = async () => {
	uni.showLoading({
		title: '数据请求中···'
	});
	const res = await get('agent/center/price_list', { type: 1 });
	const { code, data } = res;
	if (code == 200) {
		state.price = data.price;
		state.list = data.list.data;
		state.totalPage = data.list.last_page;
	}
	uni.hideLoading();
};

const gotoPage = (id) => {
	uni.navigateTo({
		url: `/pages/dongjiedetail/dongjiedetail?id=${id}`
	});
};
</script>
